<template>
  <input type="text" placeholder="请输入员工姓名" v-model="word">
  <button @click="search">查询</button>
  <p>姓名:{{emp.name}}岗位：{{emp.job}} 薪资:{{emp.sal}}</p>
</template>

<script setup>
  import {ref} from 'vue'
  import axios from "axios"
  // 定义word变量接受员工姓名
  const word = ref('')  // 响应变量
  const emp = ref({})
  //定义seacrh函数，
  const search = ()=>{
    // axios请求按名字查询员工信息的接口
    // http://localhost:8080/v1/emp/getEmpByName
    // 需要传递参数 name
    axios.get('http://localhost:8080/v1/emp/getEmpByName?name='+word.value).then((response)=>{
      console.log("======数据:"+response.data)
      emp.value = response.data  //将返回的数据赋值给emp
    })
  }
</script>

<style scoped>

</style>